<!DOCTYPE html>
<html lang="zh-cn">

<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1,user-scalable=no">
    <title>我的关注</title>


    <!-- Expand styles -->
    <link href="../css/app/app.css" rel="stylesheet">
    <link href="../css/app/default.css" rel="stylesheet">
    <link href="../css/mui/mui.css" rel="stylesheet">


    <!-- Custom styles for this template -->
    <!-- <link href="../css/iOS/mobile/mobile.css" rel="stylesheet"> -->
</head>

<body>


    <!-- header -->
    <div id="pullrefresh" class="mui-content mui-scroll-wrapper">
        <div class="mui-content">
            <div class="trade-list">

            </div>
        </div>
    </div>

    <script src="../js/dsbridge.js"></script>
    <script src="../js/jquery.js"></script>
    <script src="../js/mui/mui.js"></script>
    <script src="../js/mui/mui.picker.min.js"></script>
    <script src="../js/layer.js"></script>
    <script src="../js/app/app-base.js"></script>
    <script src="../js/app/app-url.js"></script>
    <script src="../js/app/app-ajax.js"></script>

    <script>
        var personUserAccId = localStorage.getItem("logged-person-id");
        //查看登录人的关注
        if (isEmpty(personUserAccId)) {
            personUserAccId = getUserId();
        }
        var page = 1;
        var limit = 10;
        var index = 0;
        var all_data = new Array();
        var thisId = '';
        var thisStatus = 0;
        $(document).ready(function () {

            mui.init({
                pullRefresh: {
                    container: '#pullrefresh',
                    down: {
                        auto: true, // 首次进入自动加载
                        callback: pulldownRefresh
                    },
                    up: {
                        contentrefresh: '正在加载...',
                        callback: pullupRefresh
                    }
                }
            });
        });

        /**
         * 下拉刷新具体业务实现
         */
        function pulldownRefresh() {
            page = 1;
            var data = {
                userAccId: getUserId(),
                userId: personUserAccId,
                page: page,
                limit: limit
            }
            getServerData(url_getMy_concernList, data);
        }

        /**
         * 上拉加载具体业务实现
         */
        function pullupRefresh() {
            page++;
            var data = {
                userAccId: getUserId(),
                userId: personUserAccId,
                page: page,
                limit: limit
            }
            getServerData(url_getMy_concernList, data);
        }


        function getServerDataSuccess(url, data) {
            switch (url) {
                //详情
                case url_getMy_concernList:
                    // var plist = new Array();
                    var list = data.data;
                    var html_data = "";
                    if (page == 1) {
                        index = 0;
                        all_data.length = 0;
                    }
                    if (list.length > 0) {
                        for (var i = 0; i < list.length; i++) {
                            all_data.push(list[i]);
                            var concernStatus = list[i].concernStatus;
                            if (personUserAccId != '' && personUserAccId != getUserId()) {
                                concernStatus = list[i].otherConcernStatus;
                            }
                            html_data += '<div class="widget-default margin-b-3 widget-body">' +
                                '<div class="display-flex">';
                            if (list[i].headPortrait != '') {
                                html_data += '<img class="farm-head person-info" userAccId ="' + list[i].userAccId + '"  src="' + showSmallImg(list[i].headPortrait) + '" alt="">';
                            } else {
                                html_data += '<img class="farm-head person-info" userAccId ="' + list[i].userAccId + '"  src="../img/headimg.png" alt="">';
                            }

                            html_data += '<div class="display-flex align-items-center justify-content-between width-100 margin-l-10">' +
                                '<div class="display-flex flex-column justify-content-between">' +
                                '<span class="elli1 font-weight black font-16 font-weight">' + list[i].userName + '</span>' +
                                '<span class="gray font-12 padding-t-10">粉丝数：' + list[i].fansNum + '</span>' +
                                '</div>' +
                                '<div class="farm-label text-center margin-t-5">';
                            if (concernStatus == 1) {
                                html_data += '<a class="guanzhu gray font-12 farm-label-bg"  href="#"  status="' + concernStatus + '"  id="' + list[i].userAccId + '" >已关注</a>';
                            } else if (concernStatus == 2) {
                                html_data += '<a class="guanzhu gray font-12 farm-label-bg"   status="' + concernStatus + '"  id="' + list[i].userAccId + '">互相关注</a>';
                            } else {
                                html_data += '<a class="guanzhu white font-12 bc-head"  status="' + concernStatus + '"  id="' + list[i].userAccId + '" >关注</a>';
                            }
                            html_data += '</div>' +
                                '</div>' +
                                '</div>' +
                                '</div>';

                            index++;
                        }
                        ;
                    }
                    if (page == 1) {
                        mui('#pullrefresh').pullRefresh().endPulldownToRefresh();
                        if (list.length > 0) {
                            mui('#pullrefresh').pullRefresh().refresh(true);
                        }
                        $(".trade-list").html(html_data);
                    } else {
                        $(".trade-list").append(html_data);
                        mui('#pullrefresh').pullRefresh().endPullupToRefresh(list.length != limit);
                    }

                    break;
                case url_oper_action_cancel:
                    $("#" + thisId).attr("class", "guanzhu white font-12 bc-head");
                    $("#" + thisId).html("关注");
                    $("#" + thisId).attr("status", '0');
                    break;
                case url_oper_action:
                    $("#" + thisId).attr("class", "guanzhu gray font-12 farm-label-bg");
                    var isConcern = data.isConcern;
                    if (isConcern == 0) {
                        $("#" + thisId).html("已关注");
                        $("#" + thisId).attr("status", '1');

                    } else if (isConcern == 1) {
                        $("#" + thisId).html("互相关注");
                        $("#" + thisId).attr("status", '2');
                    }
                    break;
            }
        }


        function getServerDataFailed(url, data) {
            mui('#pullrefresh').pullRefresh().endPulldownToRefresh();
            mui('#pullrefresh').pullRefresh().endPullupToRefresh(true);
        }

        mui(".trade-list").on('tap', '.guanzhu', function () {
            thisId = $(this).attr("id");
            thisStatus = $(this).attr("status");
            if (thisStatus == 1 || thisStatus == 2) {
                var data = {
                    userId: getUserId(),
                    itemId: thisId,
                    actionType: 5
                }
                getServerData(url_oper_action_cancel, data);
            }
            if (thisStatus == 0) {
                var data = {
                    userId: getUserId(),
                    itemType: 20,
                    itemId: thisId,
                    channel: 2,
                    actionType: 5
                }
                getServerData(url_oper_action, data);
            }

        });
        mui(".trade-list").on('tap', '.person-info', function () {
            localStorage.setItem("person-id",$(this).attr("userAccId")); 
            dsBridge.call("goPersonInfo");
        });
    </script>

</body>

</html>